<template>
    <div>
        <div class="left">
            <ul>
                <li>
                    <a v-link="{ path: '/a' }">aaaaaaaa</a>
                </li>
                <li>
                    <a v-link="{ path: '/b' }">bbbbbbbb</a>
                </li>
            </ul>
        </div>
        <div class="right">
            <router-view></router-view>
        </div>
    </div>
</template>
<script>
    export default{
        data(){
            return {};
        }
    }
</script>
<style>
    @import './styles/base.css';
    body {
        background: #fff;
    }
    
    .left {
        width: 200px;
        float: left;
        border-right: 1px solid #ddd;
    }
    
    .left li {
        height: 35px;
        line-height: 35px;
        width: 100%;
        border-bottom: 1px #ddd solid;
    }
    
    .left li a {
        display: block;
        width: 100%;
        text-decoration: none;
    }
    
    .right {
        margin-left: 220px;
    }
</style>